<template>
	<view class="content">
		<!-- 顶部导航栏组件 -->
		<view class="news-box">
			<!-- 新闻描述 -->
			<view class="news-remark">
				<u--text :text="newsData.remark" v-if="newsData.remark" :bold="true" size="22"></u--text>
			</view>
			<!-- 发送方和发送时间 -->
			<view class="new-item-time">
				<view class="building">
					<u--text :prefixIcon="building" :text="newsData.sender" align="left" size="20rpx"
						:iconStyle="{width:20+'rpx',height:20+'rpx'}" color="#999999" lines="1" v-if="newsData.sender"></u--text>
				</view>

				<view class="building">
					<u--text :text="newsData.create_at" size="20rpx" color="#999999" align="left" v-if="newsData.create_at"></u--text>
				</view>
				<u--text prefixIcon="bookmark" :text="newsData.num_read" size="20rpx" color="#999999" align="left" v-if="newsData.num_read || newsData.num_read == 0"></u--text>
			</view>
			<!-- 内容 -->
			<view class="u-content">
				<u-parse :content="newsData.content"></u-parse>
			</view>
		</view>

	</view>
</template>

<script>
	const index = require('@/api/index/index.js')
	export default {
		data() {
			return {
				newsData: {},
				building: this.$https.assetsPath + '48c89be73bd5b5100d62d9e224efd88047b262fa.png',
			};
		},
		onLoad(option) {
			let that = this
			if(option.id){
				that.getNewsDetail(option.id)
			}
		},
		methods: {
			async getNewsDetail(id){
				let that = this
				let data = {
					id: id
				}
				let result = await index.getNewsDetail(data)
				if(result.code == 1){
					that.newsData = result.data.data
				}
			}
		}
	}
</script>

<style lang="scss">
	.content {
		width: 100%;
		height: 100vh;
		display: flex;
		flex-direction: column;
		background-color: rgb(243, 243, 243);
		padding: 0rpx 0 50rpx 0;
		
		/deep/ .nav-bar {
			position: fixed;
		}
	}
	.new-item-time{
		display: flex;
	}
	.building{
		width: 200rpx;
	}
	.new-item-time /deep/ .u-text__value {
		margin-left: 20rpx;
		margin-right: 20rpx;
	}
	.news-box{
		padding: 26rpx;
	}
	.news-remark{
		padding-bottom: 20rpx;
	}
	.new-item-time{
		padding-bottom: 20rpx;
	}
</style>
